<!-- wp:paragraph -->
<p>Default Button links inside default Buttons container</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"className":"wp-block-button"} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default size</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default size</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:paragraph -->
<p>Adding preset on the Buttons container, not individual Button links</p>
<!-- /wp:paragraph -->

<!-- wp:buttons {"align":"wide","layout":{"type":"flex","justifyContent":"left"},"fontSize":"normal"} -->
<div class="wp-block-buttons alignwide has-custom-font-size has-normal-font-size"><!-- wp:button {"className":"wp-block-button"} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Medium Preset on Buttons</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Medium Preset on Buttons</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:paragraph -->
<p>Adding preset on the two individual Button links, not the container</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"className":"wp-block-button has-custom-font-size has-large-font-size","fontSize":"large"} -->
<div class="wp-block-button has-custom-font-size has-large-font-size"><a class="wp-block-button__link wp-element-button" href="#">Large</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button has-custom-font-size is-style-outline has-large-font-size","fontSize":"large"} -->
<div class="wp-block-button has-custom-font-size is-style-outline has-large-font-size"><a class="wp-block-button__link wp-element-button" href="#">Large</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button"} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:paragraph -->
<p>Adding custom size on the Buttons container, not individual Button links</p>
<!-- /wp:paragraph -->

<!-- wp:buttons {"style":{"typography":{"fontSize":"16px"}}} -->
<div class="wp-block-buttons has-custom-font-size" style="font-size:16px"><!-- wp:button {"className":"wp-block-button"} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">16px on Buttons</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">16px on Buttons</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:paragraph -->
<p>Adding custom size on the two individual Button links, not the container</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"style":{"typography":{"fontSize":"16px"}},"className":"wp-block-button has-custom-font-size"} -->
<div class="wp-block-button has-custom-font-size" style="font-size:16px"><a class="wp-block-button__link wp-element-button" href="#">16px</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"typography":{"fontSize":"16px"}},"className":"wp-block-button has-custom-font-size is-style-outline"} -->
<div class="wp-block-button has-custom-font-size is-style-outline" style="font-size:16px"><a class="wp-block-button__link wp-element-button" href="#">16px</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button"} -->
<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"wp-block-button is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button" href="#">Default</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->